<template>
	<!-- 新增车型 -->
	<div id="addNewHandle">
		<el-form class="carBrandModel" ref="carBrandModel" :model="carBrandModel" :rules="rules" label-width="80px">
			<el-form-item label="车辆品牌" prop="carBrand">
				<el-input class="input" v-model="carBrandModel.carBrand" placeholder="请输入车辆品牌"/>
			</el-form-item>
			<el-form-item label="车辆型号" prop="carModel">
				<el-input class="input" v-model="carBrandModel.carModel" placeholder="请输入车辆型号"/>
			</el-form-item>
			<div class="dis_f_aro">
				<el-button @click="cancelHandle">取 消</el-button>
				<el-button type="primary" @click="submitHandle">确 定</el-button>
			</div>
		</el-form>
	</div>
</template>
<script>
import { addCarBrandModel } from "@/api/carBrandModel";
export default {
	data(){
		return {
			carBrandModel: {},
			rules: {
				carBrand: [{required: true, message: "车辆品牌不能为空", trigger: "blur"}],
				carModel: [{required: true, message: "车辆型号不能为空", trigger: "blur"}],
			}
		}
	},
	methods: {
		/** 车型提交按钮 */
		submitHandle() {
			this.loading = this.$loading({
				lock: true,
				text: "上传中",
				background: "rgba(0, 0, 0, 0.7)",
			});
			this.$refs["carBrandModel"].validate(valid => {
				if (valid) {
					addCarBrandModel(this.carBrandModel).then(response => {
						this.$message({
							showClose: true,
							message: '新增成功',
							type: 'success'
						});
						this.carBrandModel = {};
						this.$emit("parHandle",true);
					});
				}
				this.loading.close();
			});
		},
		cancelHandle(){
			this.$emit("parHandle",false);
		}
	}
}
</script>
<style scoped lang="scss">
	@import '@/assets/css/currency.css';
</style>